<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>媒体资源共享平台</title>
<meta
	content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
	name="viewport">
<link rel="shortcut icon" data-th-href="@{static/img/logo.png}" 	type="image/x-icon">
<link rel="stylesheet"	data-th-href="@{static/AdminLTE-2.4.10/bower_components/bootstrap/dist/css/bootstrap.min.css}">
<link rel="stylesheet"	data-th-href="@{static/bootstrap-table/dist/bootstrap-table.css}">
<link rel="stylesheet"	data-th-href="@{webjars/bootstrap-select/2.0.0-beta1/dist/css/bootstrap-select.css}">
<link href="webjars/bootstrapvalidator/0.5.2/css/bootstrapValidator.css"	rel="stylesheet" />
<!-- treegrid的css -->
<link rel="stylesheet"	data-th-href="@{static/bootstrap-table/dist/extensions/treegrid/treegrid.css}">
<!-- combotree的css -->
<link rel="stylesheet"	data-th-href="@{static/combotree/bootstrap-treeview.css}">

<!-- Font Awesome -->
<link rel="stylesheet"
	data-th-href="@{static/AdminLTE-2.4.10/bower_components/font-awesome/css/font-awesome.min.css}">
<!-- Ionicons -->
<link rel="stylesheet"
	data-th-href="@{static/AdminLTE-2.4.10/bower_components/Ionicons/css/ionicons.min.css}">
<!-- Theme style -->
<link rel="stylesheet"
	data-th-href="@{static/AdminLTE-2.4.10/dist/css/AdminLTE.min.css}">
<link rel="stylesheet"
	data-th-href="@{static/AdminLTE-2.4.10/dist/css/skins/skin-blue.css}">
<link rel="stylesheet"
	data-th-href="@{static/bootstrap-fileinput-master/css/fileinput.min.css}">
<!-- <link rel="stylesheet"
	data-th-href="@{webjars/bootstrap-select/2.0.0-beta1/dist/css/bootstrap-select.css}"> -->
<link href="static/player/css/video-default.css" rel="stylesheet">
<!-- Google Font -->
<link rel="stylesheet"
	href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
<style type="text/css">
.main-header .logo {
	position: fixed;
}

.main-sidebar {
	position: fixed;
}

.nav>li {
	position: relative;
	display: block;
	cursor: pointer;
}
</style>
<style type="text/css">
.text-red {
	color: red;
	font-weight: 600;
	font-size: 18px;
	position: relative;
	top: 3px;
	margin-right: 3px;
	margin-left: 0px;
	padding: 0px;
}

</style>
</head>

<body class="hold-transition skin-blue sidebar-mini" id="top">
	<div class="wrapper">

		<!-- Main Header -->
		<header class="main-header">

			<!-- Logo -->
			<a class="logo" href="javascript:void()" onclick="$('#fistSubMenu').click()"> <span class="logo-mini"><b>媒体</b></span> <span
				class="logo-lg"><b>媒体资源共享平台</b></span>
			</a>

			<!-- Header Navbar -->
			<nav class="navbar navbar-static-top" role="navigation">
				<!-- Sidebar toggle button-->
				<a href="#" class="sidebar-toggle" data-toggle="push-menu"
					role="button"> <span class="sr-only"></span>
				</a>
				<!-- Navbar Right Menu -->
				<div class="navbar-custom-menu">
					<ul class="nav navbar-nav">
						<li class="dropdown user user-menu"><span
							sec:authorize="hasRole('ROLE_DIY')" class="navbar-text">欢迎您：开发者</span>
							<span class="navbar-text" sec:authorize="!hasRole('ROLE_DIY')">欢迎您：<span
								sec:authentication="principal.name"></span></span></li>
						<li class="dropdown user user-menu"><a
							class="dropdown-toggle" data-toggle="modal"
							data-target="#mysModal"> <span class="hidden-xs"
								data-toggle="modal">修改密码</span></a></li>
						<li class="dropdown user user-menu"><a
							href="javascript:void(0)" class="dropdown-toggle"
							onclick="logout()" data-toggle="dropdown"> <span
								class="hidden-xs" onclick="logout()">注销</span></a></li>
					</ul>
				</div>
			</nav>
		</header>
		<aside class="main-sidebar">

			<section class="sidebar">
				<ul class="sidebar-menu" data-widget="tree">
					<li class="header"></li>
					<!-- 第一次循环 -->
					<li th:each="menu,menuStat: ${menus}" th:if="${menuStat.first}" 	class="treeview active">
						<a th:if="${menu.url == ''}" href="javascript:;"> 
							<i th:class="${menu.icon}"></i> 
							<span	th:if="${menu.parentId==null}" th:text="${menu.name}"></span> 
							<span	class="pull-right-container"> 
								<i class="fa fa-angle-left pull-right"></i>
							</span>
						</a>
						<ul th:if="${menu.url == ''}" class="treeview-menu">
							<li th:each="subMenu,subMenuStat: ${menu.children}" >
								<a href="#" th:title="${subMenu.url}" > 
									<i th:class="${subMenu.icon}" th:id="${subMenuStat.first?'fistSubMenu':''}"></i>
									<span th:text="${subMenu.name}"></span>
								</a>
							</li>
						</ul> 
						<a th:if="${menu.url != ''}" href="javascript:;" th:title="${subMenu.url}" th:text="${subMenu.name}"> 
							<i 	th:class="${menu.icon}"></i> 
							<span th:if="${menu.parentId!=null}"	th:text="${menu.name}"> </span>
						</a>
					</li>
					<!-- 第一次循环结束 -->

					<!-- 后续循环 -->
					<li th:each="menu,menuStat: ${menus}" th:if="${!menuStat.first}"
						class="treeview"><a th:if="${menu.url == ''}"
						href="javascript:;"> <i th:class="${menu.icon}"></i> <span
							th:if="${menu.parentId==null}" th:text="${menu.name}"></span> <span
							class="pull-right-container"> <i
								class="fa fa-angle-left pull-right"></i>
						</span>
					</a>
						<ul th:if="${menu.url == ''}" class="treeview-menu">
							<li th:each="subMenu,subMenuStat: ${menu.children}"><a
								href="#" th:title="${subMenu.url}"> <i
									th:class="${subMenu.icon}"></i><span th:text="${subMenu.name}"></span></a></li>
						</ul> <a th:if="${menu.url != ''}" href="javascript:;"
						th:title="${subMenu.url}" th:text="${subMenu.name}"> <i
							th:class="${menu.icon}"></i> <span th:if="${menu.parentId!=null}"
							th:text="${menu.name}"> </span>
					</a></li>
					<!-- 后续循环 -->
				</ul>
			</section>
		</aside>

		<!-- Content Wrapper. Contains page content -->
		<div class="content-wrapper">
			<!-- Main content -->
			<section class="content container-fluid">

				<div id="box"></div>

			</section>
		</div>

	</div>




	<div class="modal fade" id="mysModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">密码修改</h4>
				</div>
				<div class="modal-body">
					<section class="content">
						<form id="formpwd" action="save" class="form-horizontal"
							role="form">
							<div class="form-group">
								<label for="txt_password" class="col-sm-2 control-label">旧密码</label>
								<div class="col-sm-10">
									<input type="password" name="password" class="form-control"
										id="txt_password" placeholder="旧密码">
								</div>
							</div>

							<div class="form-group">
								<label for="txt_xpassword" class="col-sm-2 control-label">新密码</label>
								<div class="col-sm-10">
									<input type="password" name="xpassword" class="form-control"
										id="txt_xpassword" placeholder="新密码">
								</div>
							</div>

							<div class="form-group">
								<label for="txt_qrpassword" class="col-sm-2 control-label">确认密码</label>
								<div class="col-sm-10">
									<input type="password" name="qrpassword" class="form-control"
										id="txt_qrpassword" placeholder="确认密码">
								</div>
							</div>


							<div class="modal-footer">
								<button type="button" class="btn btn-default"
									data-dismiss="modal">
									<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>关闭
								</button>
								<button type="submit" class="btn btn-primary">
									<span class="glyphicon glyphicon-floppy-disk"
										aria-hidden="true"></span>保存
								</button>
							</div>
						</form>
					</section>
				</div>
				<!-- /.modal-content -->
			</div>
			<!-- /.modal -->
		</div>
	</div>


	<!-- jQuery 3 -->
	<script
		data-th-src="@{static/AdminLTE-2.4.10/bower_components/jquery/dist/jquery.min.js}"></script>
	<!-- Bootstrap 3.3.7 -->
	<script
		data-th-src="@{static/AdminLTE-2.4.10/bower_components/bootstrap/dist/js/bootstrap.min.js}"></script>
	<!-- AdminLTE App -->
	<script data-th-src="@{static/AdminLTE-2.4.10/dist/js/adminlte.min.js}"></script>
	<script type="text/javascript" src="webjars/knockout/3.4.2/knockout.js"></script>
	<script src="webjars/knockout-mapping/2.4.1/knockout.mapping.js"
		type="text/javascript"></script>
	<script data-th-src="@{static/bootstrap-table/dist/bootstrap-table.js}"></script>
	<script
		data-th-src="@{static/bootstrap-table/dist/locale/bootstrap-table-zh-CN.js}"></script>
	<script type="text/javascript"
		src="webjars/bootstrap-select/2.0.0-beta1/dist/js/bootstrap-select.js"></script>
	<script type="text/javascript"
		src="webjars/bootstrap-select/2.0.0-beta1/dist/js/i18n/defaults-zh_CN.js"></script>
	<script src="webjars/bootstrapvalidator/0.5.2/js/bootstrapValidator.js"></script>
	<script src="webjars/bootbox/4.4.0/bootbox.js"></script>
	<script type="text/javascript" src="webjars/bootstrap-paginator/1.0.2/src/bootstrap-paginator.js"></script>
	<!-- treegrid的js -->
	<script
		data-th-src="@{static/bootstrap-table/dist/extensions/treegrid/bootstrap-table-treegrid.js}"></script>
	<script
		data-th-src="@{static/bootstrap-table/dist/extensions/treegrid/jquery.treegrid.js}"></script>
	<!-- combotree的js -->
	<script data-th-src="@{static/combotree/bootstrap-treeview.js}"></script>
	<script data-th-src="@{static/combotree/combotree.js}"></script>
	<script type="text/javascript"
		data-th-src="@{static/bootstrap-table/knockout.bootstrapTable.ljc.js}"></script>
	<!-- bootstrap-select的js -->
	<script type="text/javascript"
		data-th-src="@{webjars/bootstrap-select/2.0.0-beta1/js/bootstrap-select.js}"></script>
	<script type="text/javascript"
		data-th-src="@{webjars/bootstrap-select/2.0.0-beta1/dist/js/i18n/defaults-zh_CN.js}"></script>
	<!-- bootstrap-fileinput的js -->
	<script type="text/javascript"
		data-th-src="@{static/bootstrap-fileinput-master/js/fileinput.min.js}"></script>
	<script type="text/javascript"
		data-th-src="@{static/bootstrap-fileinput-master/js/locales/zh.js}"></script>
	<script type="text/javascript" data-th-src="@{static/custom2.js}"></script>
	<!-- <script type="text/javascript"
		data-th-src="@{static/jquery-qrcode-master/src/jquery.qrcode.js}"></script> -->
	<script type="text/javascript">
		$(function() {
			//$("#box").load("empty/shouye");
			$("a[title]").click(function() {
				$("a[title]").parent().removeClass("active");
				var a = $(this);
				var src = a.attr('title');
				$("#box").load(src);
				a.parent().attr("class", "active");
			});
			$("li.treeview").click(function(){
				var self=$(this);
				//console.log(self.siblings(".active"));
				self.siblings(".active").removeClass("active");
				self.addClass("active");
			}) ;
			$("#fistSubMenu").click();
		});

		function logout() {
			window.location.href = 'logout';

		}
	</script>
	<script type="text/javascript" th:inline="javascript">
		var options = {
			excluded : [ ':disabled' ],
			message : '验证不通过',
			feedbackIcons : {
				valid : 'glyphicon glyphicon-ok',
				invalid : 'glyphicon glyphicon-remove',
				validating : 'glyphicon glyphicon-refresh'
			},
			fields : {
				verbose : false,
				password : {
					validators : {
						notEmpty : {
							message : '旧密码不能为空'
						},
						remote : {
							url : 'customer/pyanz',
							message : "旧密码不正确",
							type : "post",
							dataType : 'json',
							data : {
							//默认传递的就是输入框的值
							},
							delay : 500,//延迟效果
						}
					}
				},
				xpassword : {
					validators : {
						notEmpty : {
							message : '新密码不能为空'
						},
						/* stringLength : {
							min : 3,
							max : 16,
							message : '密码长度为3-16位'
						} */
						regexp: {
                            regexp: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[$@$!%*?&])[A-Za-z\d$@$!%*?&]{8,}/,
                            message: '至少8个字符，至少1个大写字母，1个小写字母，1个数字，1个特殊字符'
                        }
					}
				},
				qrpassword : {
					validators : {
						notEmpty : {
							message : '确认密码不能为空'
						},
						identical : {
							field : 'xpassword',
							message : '两次输入的密码不相符'
						}

					}
				}
			}
		};

		$('#formpwd').bootstrapValidator(options).on('success.form.bv',
				function(e) {
					e.preventDefault(); //很重要没有它则会提交默认表单，不会做下面的ajax表单提交
					var fd = new FormData($("#formpwd")[0]);
					$.ajax({
						url : "customer/pedit",
						type : "POST",
						data : fd,
						processData : false, // 不处理数据  
						contentType : false, // 不设置内容类型
						success : function(result) {
							bootbox.alert(result.msg);
							$("#mysModal").modal("hide");
						},
						error : function(result) {
							alert(result);
						}
					});
				});

		function gotoFirst(){
			$('#fistSubMenu').click();
		}		
	</script>
</body>
</html>